<template>
    <!--顶部栏-->
    <header v-show="$route.path == '/Index/Home'" class="header">
        <IndexHead></IndexHead>
    </header>

    <!--内容区-->
    <router-view v-slot="{ Component }">
        <keep-alive :include="cache_Store.cacheLists.index">
            <component :is="Component"/>
        </keep-alive>
    </router-view>

    <!--底部导航栏-->
    <IndexFoot></IndexFoot>

</template>


<script lang="ts" setup>
import { onMounted, ref } from 'vue'
import { RouterView } from 'vue-router'
import IndexHead from '@/components/IndexHead.vue';
import IndexFoot from '@/components/IndexFoot.vue';

import { CacheComponentStore } from '@/stores/cache/cacheComponentStore'


const cache_Store = CacheComponentStore()



onMounted(()=>{
    console.log('index被挂载了！')
})

</script>


<style lang="scss" scoped>
.header {
    background: white;
    padding: 15px 20px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100;
}
</style>